$(function(){
    loadList();
    $(".sort-text").click(function(){
        $(".sort-info").css({display:"block"});
        $(".sort-arr").css({transform:"rotate(-45deg)"});
    })
    $(".sort-info1").click(async function(){
        var goodsId = $(".sort-info1").attr("data");

        var result = await sort({ goodsId});
        console.log(result);
        console.log(11111);
        var { status, list } = result;
        console.log(status);
        if (status) {
            var html = "";
            list.forEach(({ id, goodsId, goodsName, goodsPrice, goodsImg, goodsNameEn }) => {
                html += `
                    <li>
                    <a href="../html/detail.html?gid=${goodsId}"><img src="https://www.origins.com.cn/${goodsImg}" alt=""></a>
                    <div class="brand_en"><a href="../html/detail.html?gid=${goodsId}">${goodsNameEn}</a></div>
                    <h2 class="brand_cb"><a href="../html/detail.html?gid=${goodsId}">${goodsName}</a></h2>
                    <div class="price">￥${goodsPrice}</div>
                    <div class="func">
                        <div class="addcar"><a href="../html/detail.html?gid=${goodsId}">添加到购物车</a></div>
                        <div class="detail"><a href="../html/detail.html?gid=${goodsId}">产品详情</a></div>
                    </div>
                </li>
                `
            })
            $(".goods").html(html);
        }
    })


    $(".sort-info2").click(async function () {
        var priceAsc = $(".sort-info2").attr("data");

        var result = await sort({ priceAsc: priceAsc});
        console.log(result);
        console.log(11111);
        var { status, list } = result;
        console.log(status);
        if (status) {
            var html = "";
            list.forEach(({ id, goodsId, goodsName, goodsPrice, goodsImg, goodsNameEn }) => {
                html += `
                    <li>
                    <a href="../html/detail.html?gid=${goodsId}"><img src="https://www.origins.com.cn/${goodsImg}" alt=""></a>
                    <div class="brand_en"><a href="../html/detail.html?gid=${goodsId}">${goodsNameEn}</a></div>
                    <h2 class="brand_cb"><a href="../html/detail.html?gid=${goodsId}">${goodsName}</a></h2>
                    <div class="price">￥${goodsPrice}</div>
                    <div class="func">
                        <div class="addcar"><a href="../html/detail.html?gid=${goodsId}">添加到购物车</a></div>
                        <div class="detail"><a href="../html/detail.html?gid=${goodsId}">产品详情</a></div>
                    </div>
                </li>
                `
            })
            $(".goods").html(html);
        }
    })

    $(".sort-info3").click(async function () {
        var priceDesc = $(".sort-info3").attr("data");

        var result = await sort({ priceDesc:priceDesc });
        console.log(result);
        console.log(11111);
        var { status, list } = result;
        console.log(status);
        if (status) {
            var html = "";
            list.forEach(({ id, goodsId, goodsName, goodsPrice, goodsImg, goodsNameEn }) => {
                html += `
                    <li>
                    <a href="../html/detail.html?gid=${goodsId}"><img src="https://www.origins.com.cn/${goodsImg}" alt=""></a>
                    <div class="brand_en"><a href="../html/detail.html?gid=${goodsId}">${goodsNameEn}</a></div>
                    <h2 class="brand_cb"><a href="../html/detail.html?gid=${goodsId}">${goodsName}</a></h2>
                    <div class="price">￥${goodsPrice}</div>
                    <div class="func">
                        <div class="addcar"><a href="../html/detail.html?gid=${goodsId}">添加到购物车</a></div>
                        <div class="detail"><a href="../html/detail.html?gid=${goodsId}">产品详情</a></div>
                    </div>
                </li>
                `
            })
            $(".goods").html(html);
        }
    })


    $(".sort-info").click(function(){
        $(".sort-info").css({ display: "none" });
        $(".sort-arr").css({ transform: "rotate(135deg)" });
    })
    
    async function loadList() {
        
        var result = await SearchAllgoods();
        console.log(result);
        var { status, list } = result;
        console.log(status);
        if (status) {
            var html = "";
            list.forEach(({ id, goodsId, goodsName, goodsPrice, goodsImg, goodsNameEn }) => {
                html += `
                    <li>
                    <a href="../html/detail.html?gid=${goodsId}"><img src="https://www.origins.com.cn/${goodsImg}" alt=""></a>
                    <div class="brand_en"><a href="../html/detail.html?gid=${goodsId}">${goodsNameEn}</a></div>
                    <h2 class="brand_cb"><a href="../html/detail.html?gid=${goodsId}">${goodsName}</a></h2>
                    <div class="price">￥${goodsPrice}</div>
                    <div class="func">
                        <div class="addcar"><a href="../html/detail.html?gid=${goodsId}">添加到购物车</a></div>
                        <div class="detail"><a href="../html/detail.html?gid=${goodsId}">产品详情</a></div>
                    </div>
                </li>
                `
            })
            $(".goods").html(html) ;
        }
    }


   
})